---
layout: default
title: Categories
description: "文章分类"
header-img: "/img/categories-bg.jpg"
---

<header class="intro-header" style="background-image: url('{{ site.BASE_PATH }}{% if page.header-img %}{{ page.header-img }}{% else %}{{ site.header-img }}{% endif %}')">
    <div class="container">
        <div class="row">
            <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1 ">
                <div class="site-heading">
                    <h1>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</h1>
                    <!--<hr class="small">-->
                    <span class="subheading">{{ page.description }}</span>
                </div>
            </div>
        </div>
    </div>
</header>

<div class="col-sm-2 col-sm-offset-2 col-xs-5">
    <ul class="nav nav-tabs-vertical">
      {% assign categories_list = site.categories %}
      {% if categories_list.first[0] == null %}
        {% for category in categories_list %}
            <li>
                <a href="{{ site.BASE_PATH }}/{{ site.categories_path }}#{{ category | replace:' ','-' }}-ref" data-toggle="tab">
                  {{ category | capitalize }} <span class="badge pull-right">{{ site.categories[category].size }}</span>
               </a>
            </li>
        {% endfor %}
      {% else %}
        {% for category in categories_list %}
            <li>
                <a href="{{ site.BASE_PATH }}/{{ site.categories_path }}#{{ category[0] | replace:' ','-' }}-ref" data-toggle="tab">
                    {{ category[0] | capitalize }} <span class="badge pull-right">{{ category[1].size }}</span>
                </a>
            </li>
        {% endfor %}
      {% endif %}
      {% assign categories_list = nil %}
    </ul>
</div>

<!-- Tab panes -->

<div class="tab-content col-sm-8 col-xs-7">
  {% for category in site.categories %}
    <div class="tab-pane" id="{{ category[0] | replace:' ','-' }}-ref">
      <h3 style="margin-top: 0px">Posts in {{ category[0] | capitalize }}</h3>
      <ul class="list-unstyled">
        {% assign pages_list = category[1] %}
        {% for node in pages_list %}
          {% if node.title != null %}
            {% if group == null or group == node.group %}
              <li><a href="{{ site.BASE_PATH }}{{node.url}}">{{node.title}}</a> <span class="text-muted"> &raquo;  {{ node.date | date: "%F" }}</span></li>
            {% endif %}
          {% endif %}
        {% endfor %}
        {% assign pages_list = nil %}
      </ul>
    </div>
  {% endfor %}
</div>

<div class="clearfix"></div>
